<script setup>
import Asider from '@/component/public/Aside.vue'
import Header from '@/component/public/Header.vue'
import Main from '@/component/public/Main.vue'
</script>
<template>
  <el-scrollbar max-height="100vh" min-size="20">
    <el-container>
      <!-- 顶部栏 -->
      <el-header> <Header></Header></el-header>
      <el-container>
        <!-- 侧边栏 -->
        <el-aside><Asider></Asider></el-aside>
        <el-container>
          <!-- 内容区 -->
          <el-main><Main></Main></el-main>
          <!-- 脚本区 -->
          <!-- <el-footer></el-footer> -->
        </el-container>
      </el-container>
    </el-container>
  </el-scrollbar>
</template>
<style lang="scss" scoped>
.el-container {
  height: 100%;
}
.el-header,
.el-footer {
  background-color: #b3c0d1;
  padding: 0;
  width: 100%;
  height: 100%;
}
.el-aside {
  width: auto;
  // background-color: #ffffff;
  background-image: url(./assets/img/1.jpeg);
  background-position: right -550px;
  padding: 0;
}
.el-main {
  background-color: #e9eef3;
  padding: 0;
  overflow: auto;
}
</style>
